<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../css/mui.min.css" rel="stylesheet" />
		<style>
			html,
			body {
				background-color: #efeff4;
			}
			
			.mui-off-canvas-right {
				color: #fff;
			}
			
			textarea,
			input {
				color: #000000;
			}
		</style>
	</head>

	<body>

		<div class="mui-content">
			<div id="offCanvasSideScroll" class="mui-scroll-wrapper">
				<div class="mui-scroll">
					<div align="center" style="margin: 10px;">运动发起</div>
					<div class="content" style="margin: 10px;">
						<input type="text" placeholder="活动标题填写不能为空 " style="width:100%; " />
						<div>
							<span class="mui-icon mui-icon-location "></span>郑州市
							<span class="mui-icon mui-icon-arrowdown "></span>金水区
							<span class="mui-icon mui-icon-arrowdown "></span>
						</div>
						<textarea name="" rows="4" cols="5" placeholder="活动内容描述"></textarea>
						<br>添加照片<br>
						<div id="photo">
							<img id="addPhoto" onclick="galleryImgs();" src="../icon/addPhoto.png" width="72px" height="72px" />
						</div>
						<br>选择地点<br>
						<img onclick="showMaps();" src="../icon/addMap.png" />
						<img src="../icon/cdyy.png" />
						<br>
						<button onclick="closeWrapper()" type="button">确认发布</button>
					</div>
				</div>
			</div>
		</div>
		<script src="../js/mui.min.js"></script>
		<script src="../js/common.js"></script>
		<script type="text/javascript">
			mui.init();
			var main = null;
			mui.plusReady(function() {
				main = plus.webview.currentWebview().opener();
			});

			function galleryImgs() {
				// 从相册中选择图片
				plus.gallery.pick(function(e) {
					var div = document.getElementById("photo");
					var ima0 = document.getElementById("addPhoto");
					for(var i in e.files) {
						var img = document.createElement("img");
						img.src = e.files[i];
						img.style.width = "72px";
						img.style.height = "72px";
						img.style.margin = "2px";
						div.insertBefore(img, ima0);
					}
				}, function(e) {
					console.log(e);
				}, {
					filter: 'image',
					multiple: true,
					system: false
				});
			}

			function showMaps() {
				if('Android' === plus.os.name && navigator.userAgent.indexOf('StreamApp') > 0) {
					plus.nativeUI.toast('当前环境暂不支持地图插件');
					return;
				}
				var ws = plus.webview.currentWebview();
				var wm = plus.webview.getWebviewById(plus.runtime.appid);
				wm && wm.evalJS("preateClear()");
				mui.openWindow("map/maps_map.html", "map");
			}

			function closeWrapper() {
				mui.fire(main, "menuClose");
			}

			mui('#offCanvasSideScroll').scroll();
		</script>
	</body>

</html>